<!DOCTYPE html>
<html lang="en">

<head>
  <meta charset="UTF-8">
  <meta http-equiv="X-UA-Compatible" content="IE=edge">
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
  <title>DOM</title>
  <script>
    
    // 延迟代码执行 页面文档加载完毕再执行js代码
    window.onload = function () {
      console.log(1);
      // 弹框 警告框
      // 阻止代码向下运行
      // alert('代码按照从上到下顺序执行');
      var div = document.getElementsByClassName('one')[0];
      console.log(div);
      var div1=document.getElementById('two');
      console.log(div1);
      var div2=document.getElementsByTagName('div')[1];
      console.log(div2);
      // 获取标签的方法
      // document.getElementById('two');
      // // 获取所有类名为one标签 返回的是一个类数组对象
      // document.getElementsByClassName('one');
      // // 获取name属性为three的标签 返回的是一个类数组对象
      // document.getElementsByName('three');
      // // 获取标签名为div的所有标签 返回的是一个类数组对象
      // document.getElementsByTagName('div')[0];
    }
  </script>
</head>

<body>
  <!-- 文档里面的任何东西都可以看成节点 文档节点 文本节点 元素节点 注释节点 -->
  hello
  <div class="one" id="two">文本内容</div>
  world
  <div class="three" id="'four">我是第二个div</div>
  <!-- 注释内容 -->
</body>
<script>

</script>

</html>